<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>CusFindTran</title>
    <meta name="renderer" content="webkit">
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <link rel="stylesheet" href="../../layui-v2.6.8/layui/css/layui.css"  media="all">
    <script type="text/javascript" src="../../layui-v2.6.8/layui/layui.js"></script>
    <script type="text/javascript" src="../../js/jQuery%20v3.6.0.js"></script>

</head>
<body>

    <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
        <legend>用户查询物流信息</legend>
    </fieldset>

    <form class="layui-form" action="">
        <div class="layui-form-item f1">
            <div class="layui-inline">
                <div class="layui-inline">
                    <label class="layui-form-label" style="font-size: 16px">运输单号：</label>
                    <div class="layui-input-block">
                        <input type="text" id="tid" name="title" class="layui-input" style="width: 200px">
                    </div>
                </div>
                <button type="button" id="find" class="layui-btn layui-btn-normal">查询</button>
            </div>
            <table class="layui-hide" id="custrans" lay-filter="operation">

                <script type="text/html" id="barDemo">
                    <a class="layui-btn layui-btn-xs" lay-event="confirm" id="conf">确认收货</a>
                </script>

            </table>

        </div>

    </form>

    <script>
        var table = layui.table;
        var layer = layui.layer;

        layui.use('table', function(){
            table.render({
                elem: '#custrans'
                ,url:'http://localhost:8080/cus/findtrans'
                ,toolbar: '#toolbarDemo'
                ,defaultToolbar: ['filter', 'exports', 'print']
                ,page: true
                ,cols: [[
                    {field:'tid',title: '运输单号', sort: true}
                    ,{field:'oidt',title: '订单编号', sort: true}
                    ,{field:'fidt',title: '中转公司编号'}
                    ,{field:'tdate',title: '中转时间'}
                    ,{field:'sdate',title: '收货时间', sort: true}
                    ,{field:'conf',title: '确认收货', toolbar: '#barDemo'}
                ]]
            });
        });

        //查询
        $("#find").click(function () {
            var tid=$('#tid').val()

            //开始查询逻辑
            //id空
            if(tid==null||tid==undefined||tid=="") {
                location.reload();
            }else{
                //时间空，按id查
                layer.open({
                    area: ['100%', '400px'], //宽高
                    title: ["查询结果", "align:center"],
                    maxmin: false,
                    content: '<div><table id="t" lay-filter="operation"></table></div>',
                    success: function () {
                        table.render({
                            elem: '#t',
                            url: 'http://localhost:8080/cus/findtrans/ById?tid=' + tid,
                            page: true
                            , cols: [[
                                {field:'tid',title: '运输单号', sort: true}
                                ,{field:'oidt',title: '订单编号', sort: true}
                                ,{field:'fidt',title: '中转公司编号'}
                                ,{field:'tdate',title: '中转时间'}
                                ,{field:'sdate',title: '收货时间', sort: true}
                                ,{field:'conf',title: '确认收货', toolbar: '#barDemo'}
                            ]]
                        });
                    }
                });
            }
        })


        //确认收货事件
        table.on('tool(operation)',function (obj){
            var data = obj.data;

            if(obj.event === 'confirm'){
                if(data.sdate!=null){
                    alert('已收货');
                }else {
                    layer.confirm("你确认要收货 "+data.tid+" 嘛？",function () {
                        $.ajax({
                            url:'http://localhost:8080/cus/confirm?tid='+data.tid,
                            async: true,
                            type : 'get',
                            dataType: 'json',
                            success: function (data) {
                                if (data.code === 0) {
                                    layer.msg("确认成功");
                                    setTimeout('location.reload()','1000');
                                    ;
                                } else {
                                    layer.msg("确认失败");
                                }
                            }
                            ,false: function () {
                                layer.msg("Error!");
                            }
                        })
                    })
                }
            }

        })

    </script>

</body>
</html>